﻿@model IEnumerable<dashboard.models.userview>

@{
    ViewBag.Title = "Users";
}

<h3>Daytime <small>users activity</small></h3>
<div id="userActivity"></div>

<h3>Users <small>currently logged in</small></h3>

<table class="table">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.UserName)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.LastActivity)
        </th>
    </tr>

    @foreach (var item in Model)
    {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.UserName)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.LastActivity)
            </td>
        </tr>
    }
</table>

@section Scripts {
    @Scripts.Render("~/bundles/highcharts")

    <script type="text/javascript">
        var usersChart;

        $(function () {
            usersChart = new Highcharts.Chart({
                chart: {
                    height: 300,
                    type: 'areaspline',
                    renderTo: 'userActivity'
                },

                title: {
                    text: null
                },

                exporting: {
                    enabled: false
                },

                credits: {
                    enabled: false
                },

                xAxis: {
                    title: {
                        text: '0 - 24 hours'
                    },
                    plotBands: [{ // visualize working hours
                        from: 0.0,
                        to: 8.0,
                        color: 'rgba(68, 170, 213, .2)'
                    },
                    { // visualize working hours
                        from: 17.5,
                        to: 24.0,
                        color: 'rgba(68, 170, 213, .2)'
                    }]
                },
                yAxis: {
                    title: {
                        text: null
                    }
                },
                tooltip: {
                    shared: true,
                    valueSuffix: ' percon(s)'
                },
                plotOptions: {
                    areaspline: {
                        fillOpacity: 0.5
                    }
                },
                series: [{
                    name: 'Mosaic users',
                    data: [0, 1, 0, 0, 0, 0, 0, 0, 4, 5, 6, 10, 10, 12, 13, 2, 0, 0, 0, 0, 0, 2, 2, 2]
                }, {
                    name: 'Nova users',
                    data: [0, 0, 0, 0, 0, 0, 0, 1, 2, 1, 4, 2, 4, 8, 15, 15, 18, 3, 0, 0, 0, 0, 0, 0]
                }]
            });
        });

    </script>
}


